import React from "react";
import style from "./style.module.scss";
import { SwipeCell } from 'react-vant';
// 我的关注列表
export interface FollowType {
  imagePic: string,
  name: string,
  jobTitle: string,
  inauguralHospital: string,
  number: number,
  departmentName: string,
  praise: string,//好评率，
  oncClickCancel: () => void

}
const Index: React.FC<FollowType> = ({
  imagePic,
  name,
  jobTitle,
  number,
  departmentName,
  inauguralHospital,
  praise ,
  oncClickCancel
}) => {
  // eslint-disable-next-line @typescript-eslint/no-empty-function
  return <div>
    <div className={style.physicianBox}>
      <div className={style.shadowBox}>
        <SwipeCell
          rightWidth="40"
          rightAction={
            <div className={style.unfollowBox}>
              <div className={style.unfollow} onClick={oncClickCancel}>取消关注</div>
            </div>
          }
        >
          {/* 图文混排盒子 */}
          <div className={style.physicianContent}>
            <div className={style.physicianUrl}>
              <img src={imagePic} alt="" />
            </div>
            {/* 内容盒子 */}
            <div className={style.physicianInfo}>
              <div className={style.physicianTitle}>
                <h3 className={style.physicianName}>{name}</h3>
                <span className={style.physician}>{jobTitle}</span>
              </div>
              <div className={style.hospital}>{inauguralHospital}/{departmentName}</div>
              <div className={style.record}>
                <div className={style.comment}>好评率{praise}</div>
                <div className={style.serve}>服务患者指数{number}</div>
              </div>
            </div>
          </div>
        </SwipeCell>
      </div>
    </div>
  </div>;
};

export default Index;
